<template>
  <div class="my-bind-box common-page">
    <van-tabs
      v-model="activeName"
      color="#3B6BD8"
      title-active-color="#3B6BD8"
      :border="false"
    >
      <van-tab
        :title="item.label"
        v-for="item in tabList"
        :key="item.name"
        :name="item.name"
      >
        <bind-box-tabItem
          :activeName="activeName"
          @confirmDeliveryGoodsSuccess="confirmDeliveryGoodsSuccess"
          @refreshSuccess="refreshSuccess"
          :isRefreshReceived="isRefreshReceived"
          @enterIntoFillAddress='enterIntoFillAddress'
          v-if="activeName===item.name"
        ></bind-box-tabItem>
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import BindBoxTabItem from "@/components/BindBoxTabItem";
import { Tab, Tabs, List } from "vant";
import Share from "./mixin/share";
const StatusEums = {
  NEGATIVE: 0,
  POSITIVE: 1,
  OPENED: 2,
  EXPRESS_INFO_SUBMITTED: 3,
  PRIZE_DELIVERED: 4,
  PRIZE_RECEIVED: 5,
};
const StatusDescEums = {
  NEGATIVE: "失效",
  POSITIVE: "待开启", //未打开
  OPENED: "待领取", //已打开
  EXPRESS_INFO_SUBMITTED: "待发货", //已填写收货信息
  PRIZE_DELIVERED: "已发货",
  PRIZE_RECEIVED: "已收货",
};

export default {
  name: "MyBlindBox",
  components: {
    [Tab.name]: Tab,
    [Tabs.name]: Tabs,
    [List.name]: List,
    [BindBoxTabItem.name]: BindBoxTabItem,
  },
  mixins: [Share],
  data() {
    return {
      emptyImg:
        "http://alivod.sdxgxx.cn/image/default/805FA0987DC9499D957BB7FF046D958C-6-2.png",
      list: [],
      activeName: "1",
      tabList: [
        // {
        //   name: "-1",
        //   label: "全部",
        // },
        {
          name: "1",
          label: "待开启",
        },
        {
          name: "2",
          label: "待领取",
        },
        {
          name: "3",
          label: "待发货",
        },
        {
          name: "4",
          label: "已发货",
        },
        {
          name: "5",
          label: "已收货",
        },
        {
          name: "6",
          label: "已折换",
        },
      ],
      status: "",
      isRefreshReceived: false,
    };
  },
  created() {
    if (this.$route.query.activeName) {
      this.activeName = this.$route.query.activeName || "-1";
    }
    this.setShare();
  },
  methods: {
    //  进入填写地址页面
    enterIntoFillAddress(prizeInfo) {
      this.$router.replace({
        path: "/fillAddress",
        query: {
          prizeInfo: JSON.stringify(prizeInfo)
        },
      });
    },
    refreshSuccess() {
      this.isRefreshReceived = false;
    },
    //  确认收货成功
    confirmDeliveryGoodsSuccess() {
      this.isRefreshReceived = true;
    },
  },
};
</script>

<style lang="less" scoped>
@import "../common/css/common.less";

.my-bind-box {
  padding-left: 0;
  padding-right: 0;
  padding-top: 88px;
  box-sizing: border-box;
  ::v-deep .van-tabs__wrap {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
  }
  ::v-deep .van-tab--active {
    font-size: 34px;
    font-weight: 500;
  }
  .list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
    width: 100%;
    padding: 24px 24px;
    box-sizing: border-box;
    .bind-box-item {
      margin-bottom: 24px;
    }
  }
}
</style>
